<template>
	<view class="content">
		<!-- 		<view class="top-group-view">
			<view class="top-title-view" :style="'height:'+navigationBarHeight+'px;margin-top:'+iStatusBarHeight+'px;'">
				<text class="top-title">去水印</text>
			</view>
		</view> -->

		<view class="s-btns">
			<view class="s-btn" @click="changeType" :class="{ sel: type == 0 }">去水印</view>
			<view class="s-btn" @click="changeType" :class="{ sel: type == 1 }">违禁词</view>
		</view>

		<view class="link-wrap">
			<textarea class="link-content" v-model="link" :placeholder="type == 0 ? '粘贴视频分享链接放这里' : '粘贴文案放这里'" cols="30"
				rows="5">

			</textarea>
			<view class="btns">
				<view @click="paste" class="btn green">
					粘贴链接
				</view>
				<view class="btn orange" @click="clear">
					清空内容
				</view>
				<view class="btn blue" v-if="type == 0" @click="parse">
					解析视频
				</view>
				<view class="btn blue" v-else @click="parseText">
					立即检测
				</view>
			</view>
		</view>

		<view style="padding: 0 40rpx;" class="dy-text" v-if="textInfo">
			<view style="color: red;margin-top: 10rpx;" class="text-name" v-for="name in Object.keys(textInfo).reverse()">
				{{ name }}:
				<text style="margin-left: 10rpx;" v-for="word in textInfo[name]">{{ word }}</text>

			</view>
		</view>

		<view class="video-wrap" v-if="videoInfo">
			<view class="btns">
				<view @click="copy" class="btn green">
					复制链接
				</view>
				<view class="btn orange" @click="downVideo">
					保存视频
				</view>
				<!-- 		<view class="btn blue" @click="parse">
					保存文案
				</view> -->
				<view class="btn red" @click="copyText">
					复制文案
				</view>
			</view>


			<video v-if="videoInfo.videoUrl" class="video" :src="videoInfo.videoUrl"></video>
			<view class="" v-else>

				<view v-if="videoInfo.images">
					<view class="img-info" @click="saveAllImg">点我一键保存所有图片</view>
					<view class="img-info" style="font-size: 20rpx;">无法一键保存时,长按下面图片保存</view>
					<uv-swiper @click="showPreImg(index)" previousMargin="30" nextMargin="30" :autoplay="false" radius="5"
						indicator imgMode="aspectFill" indicatorMode="dot" bgColor="#EEF1CF" circular
						:list="videoInfo.images"></uv-swiper>


					<!-- <view class="img-wrap" v-for="(item, index) in videoInfo.images" :key="index">
						<view class="img-info" style="font-size: 20rpx;">图{{ index + 1 }}(点击查看详情)</view>
						<image @click="showPreImg(index)" mode="aspectFill" show-menu-by-longpress class="dy-img" :src="item">
						</image>

					</view> -->

				</view>
				<view class="img-wrap" v-else>
					<view class="img-info">长按下面图片保存</view>
					<image show-menu-by-longpress class="dy-img" :src="videoInfo.imgUrl"></image>

				</view>
			</view>
		</view>

	</view>
</template>

<script setup>
import api from '@/common/api.js';
import {
	onLoad,
	onReady,

} from '@dcloudio/uni-app';
import { ref } from 'vue';
const list = [
	'1.png',
	'2.png'
];

onLoad(() => {
	// this.lists = JSON.stringify(this.videoInfo.images);
	// console.log('lists',this.lists)
	const isLogin = uni.getStorageSync("isLogin");
	if (!isLogin) {
		uni.reLaunch({
			url: '/pages/login/wxlogin'
		})
	}
}),
	onReady(() => {
		const iStatusBarHeight = ref(0);
		const navigationBarHeight = ref(0);
		iStatusBarHeight.value = uni.getSystemInfoSync().statusBarHeight;
		const customHeight = wx.getMenuButtonBoundingClientRect();
		navigationBarHeight.value = customHeight.height + (customHeight.top - iStatusBarHeight.value) * 2;
	});
//按钮切换
const type = ref(0);
//粘贴链接
const link = ref('');
const videoInfo = ref(null);
const textInfo = ref(null);
// 去水印 违禁词
const changeType = () => {
	console.log('11', type.value)
	link.value = ''
	videoInfo.value = null
	textInfo.value = null
	if (type.value == 0) {
		type.value = 1
	} else {
		type.value = 0
	}
};

const downImg = (index) => {
	let length = videoInfo.value.images.length
	uni.showLoading({
		title: `下载图${index + 1}/${length}`
	})

	let fileName = new Date().valueOf();
	let filePath = wx.env.USER_DATA_PATH + '/' + fileName + '.jpeg'
	const task = uni.downloadFile({
		url: videoInfo.value.images[index],
		filePath: filePath, //  拼接本地文件路径
		success: (res) => {
			let filePath = res.filePath;
			uni.saveImageToPhotosAlbum({
				filePath,
				success: (res) => {
					if (index + 1 == length) {
						uni.showToast({
							title: '全部下载成功',
							icon: 'none',
							duration: 2000
						})
					}
					let fileMgr = wx.getFileSystemManager();
					// 删除本地文件
					fileMgr.unlink({
						filePath: filePath,
						success: function (r) {
							console.log(r)
						},
					})
					uni.hideLoading()
					if (index + 1 < length) {
						downImg(index + 1)
					}
				},
				fail(err) {
					uni.hideLoading()
					uni.showToast({
						title: '保存失败',
						icon: 'none',
						duration: 2000
					})
				},
				complete(res) {
					console.log(res)
					// uni.hideLoading()
				}
			})
		},
		fail(err) {
			console.log(err)
			uni.showToast({
				title: '下载失败,请稍后再试',
				icon: 'none',
			})
		},
		complete(res) {
			console.log(res)
		}
	})

};

// 点我一键保存所有图片
const saveAllImg = () => {
	uni.getSetting({
		success: (res) => {
			console.log(res);
			if (!res.authSetting['scope.writePhotosAlbum']) {
				uni.authorize({
					scope: 'scope.writePhotosAlbum',
					success(res) {
						downImg(0);
					},
					fail() {
						uni.showModal({
							content: '请允许相册权限, 拒绝将无法正常保存视频',
							showCancel: false,
							success() {
								uni.openSetting({
									success(settingdata) {
										if (settingdata.authSetting[
											'scope.writePhotosAlbum'
										]) { } else {
											console.log('获取权限失败')
											uni.showToast({
												title: "获取权限失败",
												icon: 'none',
												duration: 2000
											});
										}
									}
								})
							}
						})
					}
				})
			} else {
				downImg(0);
			}
		}
	})
};

//浏览大图
const showPreImg = (index) => {
	uni.previewImage({
		urls: videoInfo.value.images,
		current: index
	})
};
// 保存视频
const downVideo = () => { //保存图片到相册按钮的点击事件函数
	downUrl(videoInfo.value.videoUrl)
};

const onProgress = (res) => {
	uni.showLoading({
		mask: true,
		title: res.progress ? '下载中' + res.progress + "%" : '下载中...'
	})
};

const downloadFileClick = (url) => {
	uni.showLoading({
		mask: true,
		title: '下载中...'
	})

	let fileName = new Date().valueOf();
	const task = uni.downloadFile({
		url: url,
		filePath: wx.env.USER_DATA_PATH + '/' + fileName + '.mp4', //  拼接本地文件路径
		success: (res) => {
			let filePath = res.filePath;
			uni.saveVideoToPhotosAlbum({
				filePath,
				success: (res) => {
					uni.showToast({
						title: '下载成功',
						icon: 'none',
						duration: 2000
					})
					let fileMgr = wx.getFileSystemManager();
					// 删除本地文件
					fileMgr.unlink({
						filePath: wx.env.USER_DATA_PATH + '/' + fileName +
							'.mp4',
						success: function (r) {
							console.log(r)
						},
					})
				},
				fail(err) {
					uni.showToast({
						title: '保存失败',
						icon: 'none',
						duration: 2000
					})
				},
				complete(res) {
					console.log(res)
					uni.hideLoading()
				}
			})
		},
		fail(err) {
			console.log(err)
			uni.showToast({
				title: '下载失败,请稍后再试',
				icon: 'none',
			})
		},
		complete(res) {
			console.log(res)
		}
	})
	task.onProgressUpdate(onProgress)
};


const downUrl = (downLoadUrl) => {
	if (!downLoadUrl) {
		retrun
	}

	uni.getSetting({
		success(res) {
			console.log(res);
			if (!res.authSetting['scope.writePhotosAlbum']) {
				uni.authorize({
					scope: 'scope.writePhotosAlbum',
					success(res) {
						downloadFileClick(downLoadUrl);
					},
					fail() {
						uni.showModal({
							content: '请允许相册权限, 拒绝将无法正常保存视频',
							showCancel: false,
							success() {
								uni.openSetting({
									success(settingdata) {
										if (settingdata.authSetting[
											'scope.writePhotosAlbum'
										]) { } else {
											console.log('获取权限失败')
											uni.showToast({
												title: "获取权限失败",
												icon: 'none',
												duration: 2000
											});
										}
									}
								})
							}
						})
					}
				})
			} else {
				downloadFileClick(downLoadUrl)
			}
		}
	})
};

// 复制文案
const copyText = () => {
	if (videoInfo.value?.title) {
		uni.setClipboardData({
			data: videoInfo.value?.title
		})
	}
};
// 复制链接
const copy = () => {
	console.log(videoInfo.value)
	if (videoInfo.value?.videoUrl || videoInfo.value?.imgUrl) {
		uni.setClipboardData({
			data: videoInfo.value?.videoUrl || videoInfo.value?.imgUrl
		})
	}
};
// 立即检测
const parseText = async () => {
	if (!link.value) {
		return
	}
	let params = {
		text: link.value
	}
	const res1 = await api.parseDyText(params)
	console.log(res1)
	if (res1.code == "10000") {
		textInfo.value = res1.data
	} else {

		if (res1.msg && res1.msg.indexOf("授权") > -1) {
			uni.showModal({
				title: "抖音号未授权!",
				content: "抖音授权后才能使用",
				confirmText: '去授权',
				success(res1) {
					if (res1) {
						uni.navigateTo({
							url: "/pages/mine/manage"
						})
					} else {
						console.log('取消')
					}

				},
				fail() {
					console.log('取消')
				}
			})
		} else {
			uni.showToast({
				title: res1.msg,
				icon: "none",
				duration: 2000
			})
		}

	}

};
// 解析视频
const parse = async () => {
	if (!link.value) {
		return
	}
	let params = {
		link: link.value,
		type: 0
	}
	const res = await api.parseDyVideo(params)
	console.log('res111', res)
	if (res.code == "10000") {
		videoInfo.value = res.data

	} else {

		if (res.msg && res.msg.indexOf("授权") > -1) {
			uni.showModal({
				title: "抖音号未授权!",
				content: "抖音授权后才能使用",
				confirmText: '去授权',
				success(res) {
					if (res) {
						uni.navigateTo({
							url: "/pages/mine/manage"
						})
					} else {
						console.log('取消')
					}

				},
				fail() {
					console.log('取消')
				}
			})
		} else {
			uni.showToast({
				title: res.msg,
				icon: "none",
				duration: 2000
			})
		}

	}

};
// 清空内容
const clear = () => {
	link.value = ""
};
// 粘贴链接
const paste = () => {
	uni.getClipboardData({
		success: (res) => {
			link.value = res.data
		}
	});
}

</script>

<style lang="scss">
.uv-swiper.data-v-d5ec9f60 {
	display: flex;
	flex-direction: row;
	justify-content: center;
	align-items: center;
	position: relative;
	overflow: hidden;
	height: 600rpx !important;
	background: none !important;
}

.uv-swiper__wrapper.data-v-d5ec9f60 {
	flex: 1;
	height: 100% !important;
}

.uv-swiper__wrapper__item__wrapper__image.data-v-d5ec9f60 {
	flex: 1;
	height: 100% !important;
}

.uv-swiper__wrapper__item.data-v-d5ec9f60 {
	flex: 1;
	width: 100% !important;
	height: 100% !important;
}

.uv-swiper-indicator__wrapper__dot.data-v-f1d2f6d8 {
	width: 5px;
	height: 5px;
	border-radius: 100px;
	margin: 24rpx 4px !important;
}

.content {
	background: linear-gradient(90deg, #FEFDF3, #EEF1CF);
	width: 100vw;
	height: 100vh;
	display: flex;
	flex-direction: column;
}

.top-group-view {
	width: 100vw;
	display: flex;
	flex-direction: column;
	background: linear-gradient(90deg, #FEFDF3, #EEF1CF);
}

.top-title-view {
	display: flex;
	align-items: center;
}

.top-title {
	font-size: 32rpx;
	font-family: MiSans-Medium, MiSans;
	font-weight: bold;
	margin-left: 32rpx;
	color: #333333;
}

.link-wrap {
	padding: 40rpx 40rpx;
	text-align: left;
}

.link-content {
	width: auto;
	height: 200rpx;
	padding: 30rpx 30rpx;
	margin: 0 auto;
	border: 1rpx solid red;
}

.btns {
	display: flex;
	justify-content: space-between;
	gap: 20rpx;
	margin-top: 10rpx;
}

.btn {
	text-align: center;
	flex: 1;
	color: white;
	padding: 15rpx 0;
	border-radius: 10rpx;
	font-size: 35rpx;
}

.btn.orange {
	background-color: orange;
}

.btn.red {
	background-color: red;
}

.btn.blue {
	background: linear-gradient(to right, #b221ff, #14b7ff);
}

.btn.green {
	background: #449d44;
}


.video-wrap {
	padding: 40rpx 40rpx;
}

.video {
	margin-top: 20rpx;
	width: 100%;
}

.img-wrap .dy-img {
	width: 100%;
}

.img-info {
	text-align: center;
	color: red;
	margin: 20rpx 0;
}

.s-btns {
	margin-top: 20rpx;
	padding: 20rpx 40rpx;
	display: flex;
	justify-content: space-between;
}

.s-btn {
	color: brown;
	width: 200rpx;
	text-align: center;
}

.s-btn.sel {
	color: red;
	border: 1rpx solid white;
}
</style>